<script src="../addons/jy_h5game/resource/xianchang/js/tool.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="../addons/jy_h5game/resource/xianchang/css/spinners.css?v=1">	  
<script src="../addons/jy_h5game/resource/xianchang/js/lotter_free_base.js" type="text/javascript" charset="utf-8"></script>
<script src="../addons/jy_h5game/resource/xianchang/js/screen_lottory_free.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="../addons/jy_h5game/resource/xianchang/css/screen_zjd.css?v=6" type="text/css">
<audio id="Audio_Result" src="../addons/jy_h5game/resource/xianchang/images/zjd/smashegg.mp3" preload="preload"></audio>
<style>
#poptip { position: fixed; top:40%;left:50%;width:300px;margin-left:-150px;height: 150px;background: rgba(255, 255, 255, 0.4); opacity: 0.6;filter:alpha(opacity=0.6); color:#fff;z-index: 999;  border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;}
#poptip_content { position: fixed; top:40%;left:50%;width:300px;margin-left:-150px; height: 27px; color:#fff;text-align:center;font-size:14px;z-index: 9909;text-align:center;line-height:150px}
.result-line{cursor: pointer;}
#tagid {
    width: 100px;
    height: 40px;
}
#num {
    width: 50px;
    height: 40px;
}
select {
    background-color: rgb(255, 255, 255);
    line-height: 40px;
    color: rgb(117, 117, 117);
    cursor: pointer;
    font-family: 微软雅黑;
    text-align: center;
    border-width: initial;
    border-style: none;
    border-color: initial;
    border-image: initial;
    border-radius: 3px;
}
</style>
<div ng-if="pagedata.showLoading">
	<div id="poptip"></div>
	<div id="poptip_content">
		<div class="dots-loader"> Loading… </div>
	</div>
</div>

<div class="Panel Lottery">
	<img class="boxFront" src="../addons/jy_h5game/resource/xianchang/images/zjd/box2.png">
    <div class="lottery-left"  style="width: 55%;height: 700px;">
        <div class="lottery-run">      
			<div class="outBox">
						<div class="box">
							<img class="boxImg" src="../addons/jy_h5game/resource/xianchang/images/zjd/box.png">
							<img class="boxLeft" src="../addons/jy_h5game/resource/xianchang/images/zjd/boxLeft.png">
							<img class="boxRight" src="../addons/jy_h5game/resource/xianchang/images/zjd/boxRight.png">
						</div>
						<div class="hand">
							<div class="hand1"></div>
							<div class="hand2"></div>
							<div class="user toux3" style="url({{tomedia(pagedata.user[0].headImg) ||'../images/lot_nouser.jpg'}}) no-repeat 50%;background-size: cover;">
							<p class="nick-name">{{pagedata.user[0].name}}</p>
							<p class="mobile"></p>
							</div>
						</div>
			</div> 
        </div>
        <div class="lottery-bottom">
            <div class="round-num">
				<input id="tag_num" type="hidden" value="" />
                <div class="select-panel" style="font-size:15px;">
					<div style="display:inline-block">选择奖项:</div>
					<select name="luckTag" id="tagid" ng-model="pagedata.item.p">
							<option value="-1">--请选择奖项--</option>
							<option value="{{k}}" ng-repeat="(k,v) in pagedata.jx"  >{{v.prizeLevel}}</option>
							
					</select>
					<div style="display:inline-block;margin-left:20px;">选择人数:</div>
                    <!--div class="select-button minus">-</div>
                    <div class="select-value">1</div>
                    <div class="select-button plus">+</div-->
					<select ng-model="pagedata.item.num" id="num">
													<option value="1">1</option>
													<option value="2">2</option>
													<option value="3">3</option>
													<option value="4">4</option>
													<option value="5">5</option>
													<option value="6">6</option>
													<option value="7">7</option>
													<option value="8">8</option>
													<option value="9">9</option>
													<option value="10">10</option>
													<option value="11">11</option>
													<option value="12">12</option>
													<option value="13">13</option>
													<option value="14">14</option>
													<option value="15">15</option>
													<option value="16">16</option>
													<option value="17">17</option>
													<option value="18">18</option>
													<option value="19">19</option>
													<option value="20">20</option>
													<option value="30">30</option>
													<option value="40">40</option>
													<option value="50">50</option>
													<option value="60">60</option>
													<option value="70">70</option>
													<option value="80">80</option>
													<option value="90">90</option>
													<option value="100">100</option>
													<option value="200">200</option>
				</select>
                </div>
            </div>
            <!--<div class="button-showresult">全部结果</div>-->
			<div class="control button-run" style="display: none;">开始抽奖</div>
            <div ng-show="pagedata.show1!=1" class="control button-run" style="display: block;" ng-click="pagedata.cj(pagedata.item.p)">开始砸蛋</div>
			<div ng-show="pagedata.show1==1" class="control button-run" style="display: block;" ng-click="pagedata.re()">下一轮</div>
        </div>

    </div>
	<div class="lottery-right">
        <div class="result-line">
            <div class="result-num">1</div>
			<i class="delLottery"></i>
        </div>
    </div>
</div>
<script type="text/javascript">
scope.pagedata.init = function(k){
	scope.pagedata.unum=scope.pagedata.unum+1;
	scope.pagedata.show1=1;
	scope.pagedata.show=1;
	var num=Math.ceil(Math.random()*scope.pagedata.item.num/scope.pagedata.jx[k].prizeNum); 
	if(num==Math.ceil(scope.pagedata.item.num/scope.pagedata.jx[k].prizeNum) && scope.pagedata.pnum>0){
		var img='boxRight';
		scope.pagedata.pnum=scope.pagedata.pnum-1;
	}else{
		var img='boxLeft';	
	}
	if(scope.pagedata.unum==scope.pagedata.item.num && scope.pagedata.pnum>=1){
		var img='boxRight';
		scope.pagedata.pnum=scope.pagedata.pnum-1;
	}
	setTimeout(function(){
		document.all.img1.src= '../addons/jy_h5game/resource/xianchang/images/zjd/'+img+'.png?v=3';
		scope.pagedata.show=0;
		scope.$apply();
　　},500);
}
scope.pagedata.sele = function(num){
		var k =scope.pagedata.item.p
		 window.scope.pagedata.item.name=scope.pagedata.jx[k].prizeName;
		 window.scope.pagedata.item.img=scope.pagedata.jx[k].prizeImg;
		var params = {
							'plugin':'jy_h5game',
							'action':'post_data',
							'op':'zjd',
							'data':{
								k:k,
								num:num
							},
							'callback':function(data){
										if(data){
											scope.pagedata.user=data;
										}
										 scope.$apply();
							}
		}
		scope.post_json(params);	
		scope.pagedata.pnum=scope.pagedata.jx[k].prizeNum;
		scope.pagedata.unum=0;
				 
}
scope.pagedata.cj = function(k){
	if(scope.pagedata.item.num<1 || scope.pagedata.item.num==undefined){
		alert('请选择抽奖人数');return;
	}
	if(k<0 || k==undefined){
		alert('请选择奖品');return;
	}
	if(scope.pagedata.unum==scope.pagedata.item.num){
		alert('已抽完人数');return;
	}
	$(".lottery-run").addClass('moving');
	$(".lottery-run").removeClass('box-moving');
    $(".control.button-stop").hide();
    //flgPlaying = true;
    //playanimate();
    window.setTimeout(function() {
            $(".control.button-stop").fadeIn()
			scope.pagedata.sele(1);//开始抽奖
    },500)
	scope.pagedata.init(k);
}
scope.pagedata.re = function(){
	scope.pagedata.show1=0;
	$(".lottery-run").removeClass('moving');
	document.all.img1.src= '../addons/jy_h5game/resource/xianchang/images/zjd/box.png?v=3';
}
</script>
<style>
	.del_act{display:block}
	.control2 {
	width: 36%;
    height: 50px;
    position: relative;
    float: left;
    background-color: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.4);
	border-top:0px;
    padding: 3px;
    overflow: auto;
    
	}
	.delLottery {
    width: 22px;
    height: 30px;
    cursor: pointer;
    background: url(../addons/jy_h5game/resource/xianchang/images/lotteryDel.png) no-repeat left center;
    display: block;
    position: absolute;
    top: 20px;
    right: 5px;
    z-index: 12;
    display:none
	}
	</style>
<script>
$(function(){
	$(document).on("mouseenter", ".result-line", function () {
		$(this).find('i').addClass("del_act");
   });
   $(document).on("mouseleave", ".result-line", function () {
		$(this).find('i').removeClass("del_act");
   });
	
});

</script>
<link rel="stylesheet" type="text/css" href="../addons/jy_h5game/resource/xianchang/css/footer.css">
<style>
	body {background: url(../addons/jy_h5game/resource/xianchang/style/all/035d.jpg) #000;background-size: cover;}
</style>
<script>
$(document).ready(function(){
	$("#show_hide_nav img").on('click',function() {
	if($("#panel_status").val()==0){
		$(this).attr("src",'../addons/jy_h5game/resource/xianchang/images/opened.png');
		hidetb();
		$("#panel_status").val("1");
	}else{
		
		showtb();
		$("#panel_status").val("0");
		$(this).attr("src",'../addons/jy_h5game/resource/xianchang/images/chosed.png');

	}
	});
	$("#bg_music").click(function(){
			if ($(this).css("background-image").indexOf('no') != '-1') {
                $("#audio").get(0).play();
				$(this).css("background-image","url(../addons/jy_h5game/resource/xianchang/images/music.png)");
			} else {
				$("#audio").get(0).pause();
				$(this).css("background-image","url(../addons/jy_h5game/resource/xianchang/images/no_music.png)");
			}
	});
	$("#show_qd_code").click('click',function(){
		$(".bigmpcodebar").slideUp()
		$(".show_qrcode").slideDown();
	});
	$(".show_qrcode .closebutton").on("click", function() {
			//$(".bigmpcodebar").slideUp()
			$(".show_qrcode").slideUp()
	});
});
function showtb() {
    $(".Panel.Top").css({
        top: "-" + $(".Panel.Top").height() + "px"
    });
    $(".Panel.Bottom").css({
        bottom: "-" + $(".Panel.Bottom").height() + "px"
    });
}
function hidetb() {
    $(".Panel.Top").css({
        top: 0
    });
    $(".Panel.Bottom").css({
        bottom: 0
    })
};
</script>